<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>速商在线DSS v0.1</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- Le styles -->
    <link href="//cdnjs.bootcss.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 40px;
        padding-bottom: 40px;
        background-color: #f5f5f5;
        background: url("{% url static %}images/tt2bg.png");
      }
       .container{margin-top:200px;width: 400px;}
       .pass1{
        background:url({% url static %}images/luck.gif) no-repeat 2px 6px;
        line-height:16px;
        }
        .user1{
        background:url({% url static %}images/name.gif) no-repeat 2px 6px;
        }
      .form-signin {
        max-width: 300px;
        padding: 19px 29px 29px;
        margin: 0 auto 20px;
        background-color: #fff;
        border: 1px solid #e5e5e5;
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
           -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
                box-shadow: 0 1px 2px rgba(0,0,0,.05);
      }
      .form-signin .form-signin-heading,
      .form-signin .checkbox {
        margin-bottom: 10px;
      }
      .form-signin input[type="text"],
      .form-signin input[type="password"] {
        font-size: 16px;
        height: 20px;
        margin-bottom: 15px;
        padding: 7px 9px;
        padding-left: 25px;
        width: 270px;
      }

    </style>
    <link href="//cdnjs.bootcss.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="//cdnjs.bootcss.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
    <![endif]-->

  </head>

  <body>

    <div class="container">

      <form class="form-signin" action="/loginHandle" method="POST">
        <legend contenteditable="true"><h2 class="form-signin-heading">登录</h2></legend>
        <input type="text"  name="username" class="user1" placeholder="账号">
        <input type="password"  name="password" class="pass1"  placeholder="密码">
        <button class="btn btn-large btn-primary" type="submit">登录</button>
         <span><a href="javascript:test();">注册账号</a></span>
         <!--[if lt IE 9]>
          <div class="alert">
              <button type="button" class="close" data-dismiss="alert">&times;</button>
              体验最佳浏览效果请使用Chrome、FireFox等标准浏览器访问
            </div>
        <![endif]-->
      </form>

    </div> <!-- /container -->
 <div id="alert" class="modal fade hide">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>注册</h3>
      </div>
      <div class="modal-body">
            <form action="/regHandle" method="POST">
              <fieldset>
                <label>账号</label>
                <input type="text"  name="username" placeholder="账号">
                 <label>密码</label>
                <input type="text"  name="password" placeholder="密码">
                <p><button type="submit" class="btn">注册</button></p>
              </fieldset>
        </form>
      </div>
      <div class="modal-footer">
        <a href="#" class="btn" aria-hidden="true" data-dismiss="modal">关闭</a>
      </div>
    </div>
    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="//cdnjs.bootcss.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//cdnjs.bootcss.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
   <script>
      function test(){
          $("#alert").modal();
      }
   </script>
  </body>
</html>
